<template>
	<view>
		{{msg}}
		<uni-goods-nav :fill="true"  :options="options" :buttonGroup="buttonGroup"  @click="onClick" @buttonClick="buttonClick" />
	</view>
</template>

<script>
	import {mapState,mapActions,mapGetters} from 'vuex'
	import badgeMix from '@/mixins/tabbar-badge.js'
	export default{
		//购物车数字徽标
		mixins:[badgeMix],
		data(){
			return{
				msg:"axlab 首页",
				options: [{
					icon: 'shop',
					text: '店铺',
					info: 2,
					infoBackgroundColor: '#007aff',
					infoColor: "#f5f5f5"
				}, {
					icon: 'cart',
					text: '购物车',
					info: 0
				}],
				buttonGroup: [{
						text: '加入购物车',
						backgroundColor: 'linear-gradient(90deg, #FFCD1E, #FF8A18)',
						color: '#fff'
					},
					{
						text: '立即购买',
						backgroundColor: 'linear-gradient(90deg, #FE6035, #EF1224)',
						color: '#fff'
					}
				]
			}
		},
		methods:{
			...mapActions('m_cart',['addToCart']),
			onClick(e){
				if(e.content.text === '购物车'){
					//切换到购物车页面
					uni.switchTab({
						url:'/pages/shoppingcart/shoppingcart'
					})
				}
			},
			buttonClick(e){
				if(e.content.text === '加入购物车'){
					const goods={
						goods_id:3,
						goods_name:'混动牙刷',
						goods_price:300,
						goods_origin_price:350,
						goods_count:1,
						goods_purchase_limit:10,
						goods_logo:'',
						goods_state:false,
						goods_type:'拼团',
						goods_stock:10,
						goods_efficacy:true
					}
					this.addToCart(goods)
				}
			}
		},
		computed:{
			...mapState('m_cart',['cart']),
			...mapGetters('m_cart',['total'])
		},
		watch:{
			total:{
				handler(newVal){
					const findResult = this.options.find( item => item.text === '购物车')
					if(findResult){
						findResult.info = newVal
					}
				},
				immediate:true
			}
		}
	}
</script>

<style>
</style>